<!-- 加载静态资源，如：CSS文件、JS文件等 --> 

{% extends "blog/base.html" %}
{% load blog_tags %} 
{% load static %} 

<!DOCTYPE html>
<html> 
 <head> 
  <!-- 将可能变化的标题变为可替换的标题块 --> 
  <title>>{% block title %}{{ post.title }}{% endblock %}</title> 
  <!-- 加载静态资源blog.css --> 
  <link href="{% static 'css/blog.css' %}" rel="stylesheet"> 
 </head> 
 <body> 
  <!-- 将可能变化的内容变为可替换的内容块，并添加id--> 
  <div id="content"> 
   {% block content %} 
   <h1>{{ post.title }}</h1> 
   <p class="date"> 
   Published {{ post.publish }} by {{ post.author }} 
   </p> 
   {{ post.body|markdown }} 
   <p> 
    <a href="{% url "blog:post_share" post.id %}"> 
    Share this post 
    </a> 
   </p>
   
 {% with comments.count as total_comments %} 
<h2> 
 <!-- pluralize 过滤器叫做复数过滤器，当前面的数量是大于1的则自动为comment添加
s，适用于英文--> 
 {{ total_comments }} comment{{ total_comments|pluralize }} 
</h2> 
{% endwith %} 
 <!-- 显示相似文章 -->
<!-- 标题 -->
<h2>Similar posts</h2>
<!-- 对于每篇相似文章，显示其标题并变为链接支持跳转 --> 
{% for post in similar_posts %} 
 <p> 
 <a href="{{ post.get_absolute_url }}">{{ post.title }}</a> 
 </p>
<!-- 若没有相似文章显示如下内容 --> 
{% empty %} 
 There are no similar posts yet. 
{% endfor %} 

<!-- 遍历所有评论信息并显示--> 
{% for comment in comments %} 
<div class="comment"> 
 <p class="info"> 
 <!-- forloop.counter 标签自动生成循环元素的序号 --> 
 Comment {{ forloop.counter }} by {{ comment.name }} 
 {{ comment.created }}
 </p> 
 {{ comment.body|linebreaks }} 
</div>
<!-- 如果没有评论，显示如下信息 --> 
{% empty %} 
 <p>There are no comments yet.</p> 
{% endfor %} 
 
<!-- 如果是新评论，提示你已经评论 --> 
{% if new_comment %} 
<h2>Your comment has been added.</h2>
<!-- 否则显示添加新评论并显示评论表单--> 
{% else %} 
 <h2>Add a new comment</h2> 
 <form method="post"> 
 <!-- 根据后端评论表单自动生成前端评论表单 --> 
 {{ comment_form.as_p }} 
 {% csrf_token %} 
 <p><input type="submit" value="Add comment"></p> 
 </form> 
{% endif %}
  {% endblock %} 
   </div> 
  <!-- 增加侧边栏块 --> 
  <div id="sidebar"> 
    <h2>My blog</h2> 
    <p>This is my blog.</p> 
  </div> 
 </body>
</html>
